<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>增值服务充值</title>
    <link rel="stylesheet" href="${base}/layui/css/layui.css">
    <link rel="stylesheet" href="${base}/awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="${base}/css/formSelects-v4.css">
    <link rel="stylesheet" href="${base}/css/admin.css">
    <style>
    	.layui-bg-black{width: 200px;height: 136px;margin-right: 30px;float: left;text-align: center;font-size: 33px;color: #000000!important;padding-top: 30px;}
    	.hide {display: none;}
    	.checkbox{display: inline-block;}
    	.layui-form-item{font-size: 18px;}
    	.width100 {width: 100px;}
    	.discuss{ float: left;margin-left: 30px;padding-top: 6px;}
    	.discuss p{text-align: left; font-size: 13px;margin-top: 5px;padding-top: 2px;}
    	.discuss_img{ float: left;margin-left: 10px;margin-top: 5px;}
    </style>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=co1mC9vcPKDEMyqI0UQV2eqvrAQ8mcv1"></script>
</head>
<body  class="layui-layout-body" style="overflow:scroll;">
<#include "/common/left.flt">	
<div class="layui-main" style="position: absolute;left: 205px;top: 20px; width: calc(100% - 210px);" >
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 10px;">
  <legend>用户详情</legend>
</fieldset>
<div class="layui-form"  style="padding-top:20px;">
  <div class="layui-form-item layui-form-text">
    <label class="layui-form-label">id 或 手机</label>
    <div class="layui-input-block">
      <input name="user_id" id="user_id" placeholder="请输入id或 手机" class="layui-input layui-text" value="${user_id?default('')}" />
    </div>
  </div>
  
  <div class="layui-form-item layui-form-text">
    <label class="layui-form-label">性别</label>
    <div class="layui-input-block">
      <select name="pack_type" id="pack_type" class="layui-select" lay-filter="demo" >
        <option >请选择充值类型</option>
        <option value="1">会员充值</option>
        <option value="2">热度充值</option>
       </select>
    </div>
  </div>
  <div class="layui-form-item layui-form-text">
    <label class="layui-form-label">套餐</label>
    <div class="layui-input-block">
         <select name="pack_id" id="pack_id" class="layui-select" >
         </select>
    </div>
  </div>
  <div class="layui-form-item layui-form-text">
    <label class="layui-form-label"></label>
    <div class="layui-input-inline">
	    <button class="layui-btn" id="save"><i class="fa fa-check"></i> 提交</button>	    
	</div>
  </div>
</div>

</body>
<script src="${base}/layui/layui.all.js"></script>
<script src="${base}/laydate/laydate.js"></script>
<!-- <script src="${base}/js/jquery-2.1.4.min.js" type="text/javascript"></script> -->
<script src="https://unpkg.com/jquery@3.3.1/dist/jquery.min.js"></script>
<script src="${base}/js/jquery.form.js"></script>
<script src="${base}/js/formSelects-v4.min.js" type="text/javascript"></script>

<script>
layui.use(['layer', 'jquery', 'form'], function () {
	var layer = layui.layer,
			$ = layui.jquery,
			form = layui.form;

	form.on('select(demo)', function(data){
			change(data.value);
			form.render('select');
	});
});



var pack_data = ${packageData?default('')};

function change(index){
	var taocan_data = pack_data[index];
    $("#pack_id").empty();
    $.each(taocan_data, function (key, val) {
        if(key === 0){
            var str = '<option selected value="' + val['id'] + '">' + val['title'] + '</option>';
        }else{
            var str = '<option value="' + val['id'] + '">' + val['title'] + '</option>';
        }
        $("#pack_id").append(str);
    })
}

$("#save").click(function (){
	var pack_id = $("#pack_id").val();
	if(pack_id > 0){
		var user_id = $("#user_id").val();
		$.post("${base}/users_list/add_pack",
		   		{"pack_id":pack_id,"user_id":user_id},function(data){ 
		   			layer.alert(data);
		   		}
		 );
	} else {
		layer.alert("请选择套餐");
	}
});
</script>
</html>